import useFormStore from './store/formStore';

function UpdateNameForm() {
  const { name, isPending, error, updateName } = useFormStore();

  const handleSubmit = (e) => {
    e.preventDefault();
    const formData = new FormData(e.target);
    updateName(formData.get('name'));
  };

  return (
    <form onSubmit={handleSubmit}>
      <input name="name" defaultValue={name} />
      <button type="submit" disabled={isPending}>
        {isPending ? 'Saving...' : 'Save'}
      </button>
      {error && <p>{error}</p>}
    </form>
  );
}

export default UpdateNameForm;
